<template>
  <div class="login">
    <div class="box">
      <h2>欢迎注册</h2>
    <van-cell-group>
    <van-field
      v-model="username"
      required
      clearable
      label="用户名"
      right-icon="question-o"
      placeholder="请输入用户名"
      @click-right-icon="$toast('question')"
    />

    <van-field
      v-model="password"
      type="password"
      label="密码"
      placeholder="请输入密码"
      required
    />
    </van-cell-group>
    <van-button type="primary" class="dl" size="small" @click="loginHandle()">注册</van-button>
    <van-button type="primary" class="dl" size="small" @click="logOut()">退出</van-button>

    </div>

  </div>
</template>

<script>
import { reg } from '../api/reg'
export default {
  data() {
    return {
        username:'',
        password:''
    }
  },
  methods: {
      async loginHandle() {
        const res = await reg({userName:this.username,password:this.password});
        // localStorage.setItem('token',res.data.token);
        console.log(res);
        if(res.data.code == 'success') {
        this.$router.push({name:'Login'});
        }
      },
      logOut() {
        this.$router.push({name:'shouYe'});
      }
    },
  }

</script>
<style scoped>
h2{
  text-align: center;
  opacity: .7;
}
.login{
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 30px;

}
.box{
  margin-top: 200px;
}
.dl{
    margin-top: 20px;
    border-radius: 20px;
    width: 100%;
    opacity: .7;
  }
.login{
  background: url('https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1775786694,1475171178&fm=26&gp=0.jpg');
  /* background-size: 100%; */
}
</style>
